﻿<HTML>
<head>
	<title>css editor 061222</title>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<link rel="stylesheet" type="text/css" href="qrx/qreditor.css">
<link rel="stylesheet" type="text/css" href="qrx/qrtable.css">
<link rel="stylesheet" type="text/css" href="qrx/qrpulldown.css">
<link rel="stylesheet" type="text/css" href="qrx/qrpulldown.css">
<link rel="STYLESHEET" type="text/css" id="SkinStyleSheet">
    <style type="text/css"> <!--
*{font-size:8pt}
td{white-space:nowrap}

.QrCSSDesignerPad{
	margin-top:40px;
}

.QrCSSDesignerPadLeft{
	width:;text-align:right;white-space:nowrap;padding-left:10
}

/*.QrPulldownInput{width:100}*/
--></style>

<SCRIPT lang="JavaScript" src="qrx/qrxpcom.js"></SCRIPT>
<SCRIPT lang="JavaScript" src="qrx/qrcpicker.js"></SCRIPT>
<SCRIPT lang="JavaScript" src="qrx/qrcpulldown.js"></SCRIPT>
<SCRIPT lang="JavaScript" src="qrx/qrcspinner.js"></SCRIPT>
<SCRIPT LANGUAGE="javascript" For="window" Event="onerror">
//hidde java error
return true;
</SCRIPT>

<script lang="javascript">

function getTargetStyleBycssName(scssName)
{
	return (document.getElementById("target").style[scssName]);
}

function getsrcObjectStyleBycssName(scssName)
{
	return (srcObject.style[scssName]);
}

function parseChar(sString)
{
	var returnValue=sString.replace(/\d*/,"");
	return(returnValue);
}

function SearchDemo(s){
   var r, re;                   // 声明变量。
   re = / /i;            // 创建正则表达式模式。
   r = s.search(re);            // 查找字符串。
   return(r);                   // 返回 Boolean 结果。
}
</script>
<script language="vbscript" src="../../script/window.vbs"></Script>

<script language="vbscript">
dim EditorWindow,srcObject
Set srcObject=window.dialogArguments
Set EditorWindow=srcObject.document.parentwindow.parent
SkinStyleSheet.href="../../"&EditorWindow.WebNoteSkinResourcePath&"editor.css"

Sub window_onload()

	if isObject(window.dialogArguments) then	
		target.style.cssText=srcObject.style.cssText
		target.className=srcObject.className
		getcssselectorText
		bgimg.value=srcObject.style.backgroundimage
		bgimg.value=Replace(bgimg.value,"url(","")
		bgimg.value=Replace(bgimg.value,")","")
		if target.className<>"" then
			focus_select "selCSS",target.className
		end if
	end if

	AutoResizeDialogWindow()
	
End Sub

Sub getcssselectorText()
	dim cssStyleSheet,it,i,j
	Call Add_Option("selCSS","","")
	For i=0 to srcObject.document.styleSheets.length-1
		ShowChildRules srcObject.document.styleSheets(i).rules
		For j=0 to srcObject.document.styleSheets(i).imports.Length-1
			ShowChildRules(srcObject.document.styleSheets(i).imports(j).rules)
		Next
	Next
End Sub


Sub ShowChildRules(sOjbRule)
	dim j,classNameString
	
	For j=0 to sOjbRule.length-1
		if Left(sOjbRule(j).selectorText,1)="." then
			classNameString=Replace(Trim(sOjbRule(j).selectorText),".","")
			Call Add_Option("selCSS",classNameString,sOjbRule(j).selectorText)
		end if
	Next
End Sub

Sub Print_rule_text(sText)
	document.write sText
End Sub


'确定按钮事件
Sub BtnOk_onclick()
	if isObject(window.dialogArguments) then
		BtnUse_onclick()
	else
		window.returnValue=target.style.cssText
	end if
	window.close()
End Sub

Sub BtnCancel_onclick()
	window.close()
End Sub

Sub BtnUse_onclick()
	if isObject(window.dialogArguments) then
		srcObject.style.cssText=target.style.cssText
		
		if target.className<>"" then
			srcObject.className=target.className
		else
			srcObject.removeAttribute("className")
		end if
	end if
End Sub

Sub selCSS_onchange()
	if selCss.Value<>"" then
		target.className=selCss.Value
	else
		target.removeAttribute("className")
	end if
End Sub

Sub bgimg_onchange()
	target.style.backgroundimage="url('"&bgimg.value&"')"
End Sub

Sub sel_file_onchange()
	bgimg.Value=sel_file.Value
	bgimg_onchange()
End Sub

sub BtnRemovebg_onclick()
	bgimg.Value=""
	target.style.backgroundimage=""
end sub
</script>
<script lang="JavaScript"><!--

QrXPCOM.cssToJsMap = new Array;
QrXPCOM.cssToJsMap["background"]	=	"background";
QrXPCOM.cssToJsMap["background-attachment"]	=	"backgroundAttachment";
QrXPCOM.cssToJsMap["background-color"]	=	"backgroundColor";
QrXPCOM.cssToJsMap["background-image"]	=	"backgroundImage";
QrXPCOM.cssToJsMap["background-position"]	=	"backgroundPosition";
QrXPCOM.cssToJsMap["background-position-x"]	=	"backgroundPositionX";
QrXPCOM.cssToJsMap["background-position-y"]	=	"backgroundPositionY";
QrXPCOM.cssToJsMap["background-repeat"]	=	"backgroundRepeat";
QrXPCOM.cssToJsMap["behavior"]	=	"behavior";
QrXPCOM.cssToJsMap["border"]	=	"border";
QrXPCOM.cssToJsMap["border-bottom"]	=	"borderBottom";
QrXPCOM.cssToJsMap["border-bottom-color"]	=	"borderBottomColor";
QrXPCOM.cssToJsMap["border-bottom-style"]	=	"borderBottomStyle";
QrXPCOM.cssToJsMap["border-bottom-width"]	=	"borderBottomWidth";
QrXPCOM.cssToJsMap["border-color"]	=	"borderColor";
QrXPCOM.cssToJsMap["border-left"]	=	"borderLeft";
QrXPCOM.cssToJsMap["border-left-color"]	=	"borderLeftColor";
QrXPCOM.cssToJsMap["border-left-style"]	=	"borderLeftStyle";
QrXPCOM.cssToJsMap["border-left-width"]	=	"borderLeftWidth";
QrXPCOM.cssToJsMap["border-right"]	=	"borderRight";
QrXPCOM.cssToJsMap["border-right-color"]	=	"borderRightColor";
QrXPCOM.cssToJsMap["border-right-style"]	=	"borderRightStyle";
QrXPCOM.cssToJsMap["border-right-width"]	=	"borderRightWidth";
QrXPCOM.cssToJsMap["border-style"]	=	"borderStyle";
QrXPCOM.cssToJsMap["border-top"]	=	"borderTop";
QrXPCOM.cssToJsMap["border-top-color"]	=	"borderTopColor";
QrXPCOM.cssToJsMap["border-top-style"]	=	"borderTopStyle";
QrXPCOM.cssToJsMap["border-top-width"]	=	"borderTopWidth";
QrXPCOM.cssToJsMap["border-width"]	=	"borderWidth";
QrXPCOM.cssToJsMap["bottom"]	=	"bottom";
QrXPCOM.cssToJsMap["clear"]	=	"clear";
QrXPCOM.cssToJsMap["clip"]	=	"clip";
QrXPCOM.cssToJsMap["color"]	=	"color";
QrXPCOM.cssToJsMap["cursor"]	=	"cursor";
QrXPCOM.cssToJsMap["direction"]	=	"direction";
QrXPCOM.cssToJsMap["display"]	=	"display";
QrXPCOM.cssToJsMap["filter"]	=	"filter";
QrXPCOM.cssToJsMap["font"]	=	"font";
QrXPCOM.cssToJsMap["font-family"]	=	"fontFamily";
QrXPCOM.cssToJsMap["font-size"]	=	"fontSize";
QrXPCOM.cssToJsMap["font-style"]	=	"fontStyle";
QrXPCOM.cssToJsMap["font-variant"]	=	"fontVariant";
QrXPCOM.cssToJsMap["font-weight"]	=	"fontWeight";
QrXPCOM.cssToJsMap["height"]	=	"height";
QrXPCOM.cssToJsMap["layout-flow"]	=	"layoutFlow";
QrXPCOM.cssToJsMap["layout-grid"]	=	"layoutGrid";
QrXPCOM.cssToJsMap["layout-grid-char"]	=	"layoutGridChar";
QrXPCOM.cssToJsMap["layout-grid-line"]	=	"layoutGridLine";
QrXPCOM.cssToJsMap["layout-grid-mode"]	=	"layoutGridMode";
QrXPCOM.cssToJsMap["layout-grid-type"]	=	"layoutGridType";
QrXPCOM.cssToJsMap["left"]	=	"left";
QrXPCOM.cssToJsMap["letter-spacing"]	=	"letterSpacing";
QrXPCOM.cssToJsMap["line-break"]	=	"lineBreak";
QrXPCOM.cssToJsMap["line-height"]	=	"lineHeight";
QrXPCOM.cssToJsMap["margin"]	=	"margin";
QrXPCOM.cssToJsMap["margin-bottom"]	=	"marginBottom";
QrXPCOM.cssToJsMap["margin-left"]	=	"marginLeft";
QrXPCOM.cssToJsMap["margin-right"]	=	"marginRight";
QrXPCOM.cssToJsMap["margin-top"]	=	"marginTop";
QrXPCOM.cssToJsMap["overflow"]	=	"overflow";
QrXPCOM.cssToJsMap["overflow-x"]	=	"overflowX";
QrXPCOM.cssToJsMap["overflow-y"]	=	"overflowY";
QrXPCOM.cssToJsMap["padding"]	=	"padding";
QrXPCOM.cssToJsMap["padding-bottom"]	=	"paddingBottom";
QrXPCOM.cssToJsMap["padding-left"]	=	"paddingLeft";
QrXPCOM.cssToJsMap["padding-right"]	=	"paddingRight";
QrXPCOM.cssToJsMap["padding-top"]	=	"paddingTop";
QrXPCOM.cssToJsMap["page-break-after"]	=	"pageBreakAfter";
QrXPCOM.cssToJsMap["page-break-before"]	=	"pageBreakBefore";
QrXPCOM.cssToJsMap["position"]	=	"position";
QrXPCOM.cssToJsMap["right"]	=	"right";
QrXPCOM.cssToJsMap["scrollbar-3dlight-color"]	=	"scrollbar3dLightColor";
QrXPCOM.cssToJsMap["scrollbar-arrow-color"]	=	"scrollbarArrowColor";
QrXPCOM.cssToJsMap["scrollbar-base-color"]	=	"scrollbarBaseColor";
QrXPCOM.cssToJsMap["scrollbar-darkshadow-color"]	=	"scrollbarDarkShadowColor";
QrXPCOM.cssToJsMap["scrollbar-face-color"]	=	"scrollbarFaceColor";
QrXPCOM.cssToJsMap["scrollbar-highlight-color"]	=	"scrollbarHighlightColor";
QrXPCOM.cssToJsMap["scrollbar-shadow-color"]	=	"scrollbarShadowColor";
QrXPCOM.cssToJsMap["scrollbar-track-color"]	=	"scrollbarTrackColor";
QrXPCOM.cssToJsMap["float"]	=	"styleFloat";
QrXPCOM.cssToJsMap["text-align"]	=	"textAlign";
QrXPCOM.cssToJsMap["text-align-last"]	=	"textAlignLast";
QrXPCOM.cssToJsMap["text-autospace"]	=	"textAutospace";
QrXPCOM.cssToJsMap["text-decoration"]	=	"textDecoration";
QrXPCOM.cssToJsMap["text-indent"]	=	"textIndent";
QrXPCOM.cssToJsMap["text-justify"]	=	"textJustify";
QrXPCOM.cssToJsMap["text-kashida-space"]	=	"textKashidaSpace";
QrXPCOM.cssToJsMap["text-overflow"]	=	"";
QrXPCOM.cssToJsMap["text-transform"]	=	"textTransform";
QrXPCOM.cssToJsMap["text-underline-position"]	=	"textUnderlinePosition";
QrXPCOM.cssToJsMap["top"]	=	"top";
QrXPCOM.cssToJsMap["unicode-bidi"]	=	"unicodeBidi";
QrXPCOM.cssToJsMap["visibility"]	=	"visibility";
QrXPCOM.cssToJsMap["white-space"]	=	"whiteSpace";
QrXPCOM.cssToJsMap["width"]	=	"width";
QrXPCOM.cssToJsMap["word-break"]	=	"wordBreak";
QrXPCOM.cssToJsMap["word-spacing"]	=	"wordSpacing";
QrXPCOM.cssToJsMap["word-wrap"]	=	"wordWrap";
QrXPCOM.cssToJsMap["writing-mode"]	=	"writingMode";
QrXPCOM.cssToJsMap["z-index"]	=	"zIndex";
QrXPCOM.cssToJsMap["zoom"]	=	"zoom";

var connectInstanceMap = new Array;
var connectInstanceOverrideMap = new Array;
var styles = new Array;
function connectCSS(obj, style, override){
	connectInstanceMap[style] = obj;
	connectInstanceOverrideMap[style] = override;
	obj.onChange = function(value){
		setTargetStyle(style, value);
	}
}

function connectCSS2(obj,objB, style, override){
	connectInstanceMap[style] = new Array;
	connectInstanceMap[style][0] = obj;
	connectInstanceMap[style][1] = objB;
	connectInstanceOverrideMap[style] = override;
	obj.onChange = function(value){
		value = value + objB.get();
		setTargetStyle(style, value);
	}
	objB.onChange = function(value){
		value = obj.get() + value;
		setTargetStyle(style, value);
	}
}

function setSetting()
{
	
}
function setTargetStyle(style, value){
	try{
		document.getElementById("target").style[QrXPCOM.cssToJsMap[style]] = value;
		//document.getElementById("target2").style[QrXPCOM.cssToJsMap[style]] = value;
		//document.getElementById("target3").style[QrXPCOM.cssToJsMap[style]] = value;
		styles[style] = value;
	}catch(e){
		document.getElementById("target").style[QrXPCOM.cssToJsMap[style]] = "";
		//document.getElementById("target2").style[QrXPCOM.cssToJsMap[style]] = "";
		//document.getElementById("target3").style[QrXPCOM.cssToJsMap[style]] = "";
		styles[style] = null;
	}
	setStyleText(styles);
}

function setStyleText(sObj)
{
	var st;
	var cssstr = ".someclass {\n";
	for(st in sObj){
		if(styles[st]) cssstr += "\t" + st + " : " + styles[st] + ";\n";
	}
	cssstr += "}\n";
	document.getElementById("output").value = cssstr;
}

function collapseSwitch(style){
	if(document.getElementById(style).style.visibility != "hidden"){
		var st;
		for(st in connectInstanceOverrideMap[style]){
			try{
				connectInstanceMap[style].set("");
			}catch(x){
				connectInstanceMap[style][0].set("");
			}
			document.getElementById(st).style.display = "";
		}
		document.getElementById(style+"#switch").src = "qrx/extimg/arrowopen.gif";
		document.getElementById(style).style.visibility = "hidden";
		try{
			connectInstanceMap[style].set("");
		}catch(x){
			connectInstanceMap[style][0].set("");
		}
	}else{
		var st;
		for(st in connectInstanceOverrideMap[style]){
			try{
				connectInstanceMap[style].set("");
			}catch(x){
				connectInstanceMap[style][0].set("");
			}
			document.getElementById(st).style.display = "none";
		}
		document.getElementById(style+"#switch").src = "qrx/extimg/arrowclose.gif";
		document.getElementById(style).style.visibility = "";
		try{
			connectInstanceMap[style].set("");
		}catch(x){
			connectInstanceMap[style][0].set("");
		}
	}
}

function createTaniComponent(def){
	if(!def) def = "px";
	var tan = new QrPulldown(def,3);
	tan.render();
	tan.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> px = pixels","px");
	tan.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> pt = 1/72in","pt");
	tan.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> em = font-size","em");
	tan.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> ex = x-height of font","ex");
	tan.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> pc = 12pt","pc");
	tan.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> cm","cm");
	tan.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> mm","mm");
	tan.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> in","in");
	tan.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> %","%");
	return tan;
}

function innerset(){
	document.getElementById("target").innerHTML = document.getElementById("innerset").value;
	//document.getElementById("target2").innerHTML = document.getElementById("innerset").value;
	//document.getElementById("target3").innerHTML = document.getElementById("innerset").value;
}

//--></script>
</head>
<body class="dialog" style="margin-bottom:30">
  
<table border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td valign="top">
      <table border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td colspan="2">css:<select ID="selCss"></select></td>                   
        </tr>                   
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_boderwidth)</script></td><td><span id="border-width"><SCRIPT lang="JavaScript"><!-- 
var tempBorderWidth=getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["border-width"])                  
if (SearchDemo(tempBorderWidth)) tempBorderWidth=""         
var pl = new QrSpinner(tempBorderWidth);               
pl.render();               
var override = new Array;               
override["border-top-width"]   = "";               
override["border-left-width"]   = "";               
override["border-right-width"]   = "";               
override["border-bottom-width"]   = "";               
--></SCRIPT><SCRIPT lang="JavaScript"><!--               
var tan = createTaniComponent();               
connectCSS2(pl,tan,"border-width",override);               
--></SCRIPT></span></td>            
        </tr>            
        <tr>            
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_bodertopwidth)</script></td><td><SCRIPT lang="JavaScript"><!--
var pl = new QrSpinner(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["border-top-width"]));               
pl.render();               
--></SCRIPT><SCRIPT lang="JavaScript"><!--               
var tan = createTaniComponent(parseChar(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["border-top-width"])));               
connectCSS2(pl,tan,"border-top-width");               
--></SCRIPT></td>            
        </tr>            
        <tr>            
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_boderleftwidth)</script> </td><td><SCRIPT lang="JavaScript"><!--
var pl = new QrSpinner(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["border-left-width"]));               
pl.render();               
--></SCRIPT><SCRIPT lang="JavaScript"><!--               
var tan = createTaniComponent(parseChar(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["border-left-width"])));               
connectCSS2(pl,tan,"border-left-width");               
--></SCRIPT></td>            
        </tr>            
        <tr>            
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_boderrightwidth)</script></td><td><SCRIPT lang="JavaScript"><!--
var pl = new QrSpinner(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["border-right-width"]));               
pl.render();               
--></SCRIPT><SCRIPT lang="JavaScript"><!--               
var tan = createTaniComponent(parseChar(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["border-right-width"])));               
connectCSS2(pl,tan,"border-right-width");               
--></SCRIPT></td>            
        </tr>            
        <tr>            
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_boderbottomwidth)</script></td><td><SCRIPT lang="JavaScript"><!--
var pl = new QrSpinner(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["border-bottom-width"]));               
pl.render();               
--></SCRIPT><SCRIPT lang="JavaScript"><!--               
var tan = createTaniComponent(parseChar(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["border-bottom-width"])));               
connectCSS2(pl,tan,"border-bottom-width");               
--></SCRIPT></td>            
        </tr>            
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_bodercolor)</script></td><td><span id="border-color"><SCRIPT lang="JavaScript"><!--    
  
var tempColor=getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["border-color"]);                   
if (SearchDemo(tempColor))                
	tempColor=EditorWindow.lang_css_transparent;  
var cp = new QrColorPicker(tempColor);              
cp.render();              
var override = new Array;              
override["border-top-color"]   = "";              
override["border-left-color"]   = "";              
override["border-right-color"]   = "";              
override["border-bottom-color"]   = "";              
connectCSS(cp,"border-color",override);              
--></SCRIPT></span></td>           
        </tr>                   
        <tr>                   
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_bodertopcolor)</script></td><td><SCRIPT lang="JavaScript"><!--                   
var cp = new QrColorPicker(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["border-top-color"]));              
cp.render();              
connectCSS(cp,"border-top-color");              
--></SCRIPT></td>           
        </tr>                   
        <tr>                   
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_boderleftcolor)</script></td><td><SCRIPT lang="JavaScript"><!--                   
var cp = new QrColorPicker(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["border-left-color"]));              
cp.render();              
connectCSS(cp,"border-left-color");              
--></SCRIPT></td>           
        </tr>                   
        <tr>                   
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_boderrightcolor)</script></td><td><SCRIPT lang="JavaScript"><!--                   
var cp = new QrColorPicker(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["border-right-color"]));              
cp.render();              
connectCSS(cp,"border-right-color");              
--></SCRIPT></td>           
        </tr>                   
        <tr>                   
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_boderbottomcolor)</script></td><td><SCRIPT lang="JavaScript"><!--                   
var cp = new QrColorPicker(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["border-bottom-color"]));              
cp.render();              
connectCSS(cp,"border-bottom-color");              
--></SCRIPT></td>           
        </tr>                   
        <tr>                   
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_borderstyle)</script></td><td><span id="border-style"><SCRIPT lang="JavaScript"><!--
               
var pl = new QrPulldown(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["border-style"]));               
pl.render();               
               
function addStyle(style){               
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:10px;height:10px;border-width:3px;border-style:"+style+";border-color:red' align='middle'/> "+style,style);               
}               
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;border-width:3px;border-style:none;border-color:red;' align='middle'/> none","none");               
addStyle("solid");               
addStyle("double");               
addStyle("groove");               
addStyle("ridge");               
addStyle("inset");               
addStyle("outset");               
addStyle("dashed");               
addStyle("dotted");               
var override = new Array;               
override["border-top-style"]   = "";               
override["border-left-style"]   = "";               
override["border-right-style"]   = "";               
override["border-bottom-style"]   = "";               
connectCSS(pl,"border-style", override);               
               
               
--></SCRIPT></span></td>            
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_bordertopstyle)</script></td><td><SCRIPT lang="JavaScript"><!--
               
var pl = new QrPulldown(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["border-top-style"]));               
pl.render();               
               
function addStyle(style){               
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:10px;height:10px;border-width:3px;border-style:"+style+";border-color:red' align='middle'/> "+style,style);               
}               
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;border-width:3px;border-style:none;border-color:red;' align='middle'/> none","none");               
addStyle("solid");               
addStyle("double");               
addStyle("groove");               
addStyle("ridge");               
addStyle("inset");               
addStyle("outset");               
addStyle("dashed");               
addStyle("dotted");               
connectCSS(pl,"border-top-style");               
               
--></SCRIPT></td>            
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_borderleftstyle)</script></td><td><SCRIPT lang="JavaScript"><!--
               
var pl = new QrPulldown(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["border-left-style"]));               
pl.render();               
               
function addStyle(style){               
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:10px;height:10px;border-width:3px;border-style:"+style+";border-color:red' align='middle'/> "+style,style);               
}               
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;border-width:3px;border-style:none;border-color:red;' align='middle'/> none","none");               
addStyle("solid");               
addStyle("double");               
addStyle("groove");               
addStyle("ridge");               
addStyle("inset");               
addStyle("outset");               
addStyle("dashed");               
addStyle("dotted");               
connectCSS(pl,"border-left-style");               
               
--></SCRIPT></td>            
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_borderrightstyle)</script></td><td><SCRIPT lang="JavaScript"><!--
               
var pl = new QrPulldown(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["border-right-style"]));               
pl.render();               
               
function addStyle(style){               
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:10px;height:10px;border-width:3px;border-style:"+style+";border-color:red' align='middle'/> "+style,style);               
}               
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;border-width:3px;border-style:none;border-color:red;' align='middle'/> none","none");               
addStyle("solid");               
addStyle("double");               
addStyle("groove");               
addStyle("ridge");               
addStyle("inset");               
addStyle("outset");               
addStyle("dashed");               
addStyle("dotted");               
connectCSS(pl,"border-right-style");               
               
--></SCRIPT></td>            
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_borderbottomstyle)</script></td><td><SCRIPT lang="JavaScript"><!--
               
var pl = new QrPulldown(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["border-bottom-style"]));               
pl.render();               
               
function addStyle(style){               
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:10px;height:10px;border-width:3px;border-style:"+style+";border-color:red' align='middle'/> "+style,style);               
}               
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;border-width:3px;border-style:none;border-color:red;' align='middle'/> none","none");               
addStyle("solid");               
addStyle("double");               
addStyle("groove");               
addStyle("ridge");               
addStyle("inset");               
addStyle("outset");               
addStyle("dashed");               
addStyle("dotted");               
connectCSS(pl,"border-bottom-style");               
               
--></SCRIPT></td>            
        </tr>
      </table>            
    </td>            
    <td valign="top">           
      <table border="0" cellspacing="0" cellpadding="0">                   
        <tr>                   
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_fontcolor)</script></td><td><SCRIPT lang="JavaScript"><!--                   
var cp = new QrColorPicker(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["color"]));              
cp.render();              
connectCSS(cp,"color");              
--></SCRIPT></td>       
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_fontfamily)</script></td><td><SCRIPT lang="JavaScript"><!--
               
var pl = new QrPulldown(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["font-family"]));               
pl.render();               
               
function addFont(fontname){               
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> <span style='font-family:"+fontname+"'>"+fontname+"</span>",fontname);               
} 
            
addFont("宋体");                   
addFont("新宋体");                   
addFont("楷体_GB2312");                   
addFont("仿宋_GB2312");                   
addFont("黑体");                   
addFont("Arial Black");               
addFont("Courier New");               
addFont("Georgia");               
addFont("Impact");
addFont("Lucida Console");
addFont("cursive");
addFont("Lucida Sans Unicode");
addFont("Marlett");
addFont("Symbol");
addFont("Tahoma");
addFont("Times New Roman");               
addFont("Verdana");               
addFont("Webdings");
addFont("Wingdings");
connectCSS(pl,"font-family");               
               
--></SCRIPT></td>       
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_fontsize)</script></td><td><SCRIPT lang="JavaScript"><!--
               
var pl = new QrPulldown(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["font-size"]));               
pl.render();               
               
function addFont(fontname){               
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> <span style='font-family:"+fontname+"'>"+fontname+"</span>",fontname);               
}               
addFont("9pt");               
addFont("10pt");      
addFont("11pt");              
addFont("12pt");               
addFont("14pt");               
addFont("16pt");               
addFont("xx-small");               
addFont("x-small");               
addFont("small");               
addFont("large");               
addFont("x-large");               
addFont("xx-large");               
connectCSS(pl,"font-size");               
               
--></SCRIPT></td>       
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_fontweight)</script></td><td><SCRIPT lang="JavaScript"><!--
               
var pl = new QrPulldown(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["font-weight"]));               
pl.render();               
               
function addItem(fontname){               
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> "+fontname,fontname);               
}               
addItem("normal");               
addItem("bold");               
addItem("600");               
addItem("900");               
connectCSS(pl,"font-weight");               
               
--></SCRIPT></td>       
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_fontstyle)</script></td><td><SCRIPT lang="JavaScript"><!--
               
var pl = new QrPulldown(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["font-style"]));               
pl.render();               
               
function addItem(fontname){               
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> "+fontname,fontname);               
}               
addItem("normal");               
addItem("italic");               
addItem("oblique");               
connectCSS(pl,"font-style");               
               
--></SCRIPT></td>       
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_fontvariant)</script></td><td><SCRIPT lang="JavaScript"><!--
               
var pl = new QrPulldown(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["font-variant"]));               
pl.render();               
               
function addItem(fontname){               
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> "+fontname,fontname);               
}               
addItem("normal");               
addItem("small-caps");               
connectCSS(pl,"font-variant");               
               
--></SCRIPT></td>       
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_lineheight)</script></td><td><SCRIPT lang="JavaScript"><!--
var pl = new QrSpinner(parseInt(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["line-height"])));               
pl.render();               
--></SCRIPT><SCRIPT lang="JavaScript"><!--               
var tan = createTaniComponent(parseChar(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["line-height"])));               
connectCSS2(pl,tan,"line-height");               
--></SCRIPT></td>       
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_backgroundColor)</script></td><td><SCRIPT lang="JavaScript"><!--                   
var cp = new QrColorPicker(getsrcObjectStyleBycssName("backgroundColor"));              
cp.render();              
connectCSS(cp,"background-color");              
--></SCRIPT></td>       
        </tr>
        <tr>
          <td width="50%"></td>                   
          <td width="50%"></td>                   
        </tr>                   
        <tr>                   
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_width)</script></td><td><SCRIPT lang="JavaScript"><!--
var pl = new QrSpinner(parseInt(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["width"])));               
pl.render();               
--></SCRIPT><SCRIPT lang="JavaScript"><!--               
var tan = createTaniComponent(parseChar(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["width"])));               
connectCSS2(pl,tan,"width");               
               
--></SCRIPT></td>         
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_height)</script></td><td><SCRIPT lang="JavaScript"><!--
var pl = new QrSpinner(parseInt(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["height"])));                
pl.render();               
--></SCRIPT><SCRIPT lang="JavaScript"><!--               
var tan = createTaniComponent(parseChar(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["height"])));              
connectCSS2(pl,tan,"height");               
               
--></SCRIPT></td>         
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_overflow)</script></td><td><SCRIPT lang="JavaScript"><!--
               
var pl = new QrPulldown(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["overflow"]));               
pl.render();               
               
function addItem(fontname){               
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> "+fontname,fontname);               
}               
addItem("visible");               
addItem("hidden");               
addItem("scroll");               
addItem("auto");               
connectCSS(pl,"overflow");               
               
--></SCRIPT></td>         
        </tr>
        <tr>
          <td width="33%" class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_cursor)</script></td>        
          <td width="34%"><SCRIPT lang="JavaScript"><!--               
               
var pl = new QrPulldown(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["cursor"]));               
pl.render();               
               
function addItem(fontname){               
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> "+fontname,fontname);               
}               
addItem("crosshair");               
addItem("default");               
addItem("pointer");               
addItem("move");               
addItem("text");               
addItem("wait");               
addItem("help");               
addItem("n-resize");               
addItem("s-resize");               
addItem("w-resize");               
addItem("e-resize");               
addItem("ne-resize");               
addItem("nw-resize");               
addItem("se-resize");               
addItem("sw-resize");               
connectCSS(pl,"cursor");               
               
--></SCRIPT></td>        
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_clear)</script></td><td><SCRIPT lang="JavaScript"><!--
               
var pl = new QrPulldown(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["clear"]));               
pl.render();               
               
function addItem(fontname){               
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> "+fontname,fontname);               
}               
addItem("left");               
addItem("right");               
addItem("both");               
addItem("none");               
connectCSS(pl,"clear");               
               
--></SCRIPT></td>       
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_float)</script></td><td><SCRIPT lang="JavaScript"><!--
               
var pl = new QrPulldown(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["float"]));               
pl.render();               
               
function addItem(fontname){               
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> "+fontname,fontname);               
}               
addItem("left");               
addItem("right");               
addItem("none");               
connectCSS(pl,"float");               
               
--></SCRIPT></td>       
        </tr>
        <tr>
          <td width="50%"></td>                   
          <td width="50%"></td>                   
        </tr>                   
      </table>                   
    </td>           
    <td valign="top">          
      <table border="0" cellspacing="0" cellpadding="0">                   
        <tr>                   
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_padding)</script></td><td><SCRIPT lang="JavaScript"><!--       
var tempPadding=getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["padding"])                 
if (SearchDemo(tempPadding)) tempPadding=""      
              
var pl = new QrSpinner(parseInt(tempPadding));               
pl.render();               
var override = new Array;               
override["padding-top"]   = "";               
override["padding-left"]   = "";               
override["padding-right"]   = "";               
override["padding-bottom"]   = "";               
--></SCRIPT><SCRIPT lang="JavaScript"><!--               
var tan = createTaniComponent(parseChar(tempPadding));               
connectCSS2(pl,tan,"padding",override);               
               
--></SCRIPT></td>         
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_paddingtop)</script></td><td><SCRIPT lang="JavaScript"><!--        
            
              
var pl = new QrSpinner(parseInt(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["padding-top"])));               
pl.render();               
--></SCRIPT><SCRIPT lang="JavaScript"><!--               
var tan = createTaniComponent(parseChar(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["padding-top"])));               
connectCSS2(pl,tan,"padding-top");               
               
--></SCRIPT></td>         
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_paddingleft)</script></td><td><SCRIPT lang="JavaScript"><!--
var pl = new QrSpinner(parseInt(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["padding-left"])));               
pl.render();               
--></SCRIPT><SCRIPT lang="JavaScript"><!--               
var tan = createTaniComponent(parseChar(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["padding-left"])));               
connectCSS2(pl,tan,"padding-left");               
               
--></SCRIPT></td>         
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_paddingright)</script></td><td><SCRIPT lang="JavaScript"><!--
var pl = new QrSpinner(parseInt(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["padding-right"])));               
pl.render();               
--></SCRIPT><SCRIPT lang="JavaScript"><!--               
var tan = createTaniComponent(parseChar(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["padding-right"])));               
connectCSS2(pl,tan,"padding-right");               
               
--></SCRIPT></td>         
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_paddingbottom)</script></td><td><SCRIPT lang="JavaScript"><!--
var pl = new QrSpinner(parseInt(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["padding-bottom"])));               
pl.render();               
--></SCRIPT><SCRIPT lang="JavaScript"><!--               
var tan = createTaniComponent(parseChar(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["padding-bottom"])));               
connectCSS2(pl,tan,"padding-bottom");               
               
--></SCRIPT></td>         
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_margin)</script></td><td><span id="margin"><SCRIPT lang="JavaScript"><!--     
var tempMargin=getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["margin"])                 
if (SearchDemo(tempMargin)) tempMargin=""      
  
var pl = new QrSpinner(parseInt(tempMargin));               
pl.render();               
var override = new Array;               
override["margin-top"]   = "";               
override["margin-left"]   = "";               
override["margin-right"]   = "";               
override["margin-bottom"]   = "";               
--></SCRIPT><SCRIPT lang="JavaScript"><!--               
var tan = createTaniComponent(parseChar(tempMargin));               
connectCSS2(pl,tan,"margin",override);               
--></SCRIPT></span></td>         
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_margintop)</script></td><td><SCRIPT lang="JavaScript"><!--
var pl = new QrSpinner(parseInt(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["margin-top"])));               
pl.render();               
--></SCRIPT><SCRIPT lang="JavaScript"><!--               
var tan = createTaniComponent(parseChar(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["margin-top"])));               
connectCSS2(pl,tan,"margin-top");               
               
--></SCRIPT></td>         
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_marginleft)</script></td><td><SCRIPT lang="JavaScript"><!--
var pl = new QrSpinner(parseInt(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["margin-left"])));               
pl.render();               
--></SCRIPT><SCRIPT lang="JavaScript"><!--               
var tan = createTaniComponent(parseChar(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["margin-left"])));               
connectCSS2(pl,tan,"margin-left");               
               
--></SCRIPT></td>         
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_marginright)</script></td><td><SCRIPT lang="JavaScript"><!--
var pl = new QrSpinner(parseInt(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["margin-right"])));               
pl.render();               
--></SCRIPT><SCRIPT lang="JavaScript"><!--               
var tan = createTaniComponent(parseChar(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["margin-right"])));               
connectCSS2(pl,tan,"margin-right");               
               
--></SCRIPT></td>         
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_marginbottom)</script></td><td><SCRIPT lang="JavaScript"><!--
var pl = new QrSpinner(parseInt(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["margin-bottom"])));               
pl.render();               
--></SCRIPT><SCRIPT lang="JavaScript"><!--               
var tan = createTaniComponent(parseChar(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["margin-bottom"])));               
connectCSS2(pl,tan,"margin-bottom");               
               
--></SCRIPT></td>         
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_top)</script></td><td><SCRIPT lang="JavaScript"><!--
var pl = new QrSpinner(parseInt(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["top"])));               
pl.render();               
--></SCRIPT><SCRIPT lang="JavaScript"><!--               
var tan = createTaniComponent(parseChar(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["top"])));               
connectCSS2(pl,tan,"top");               
--></SCRIPT></td>       
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_left)</script></td><td><SCRIPT lang="JavaScript"><!--
var pl = new QrSpinner(parseInt(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["left"])));               
pl.render();               
--></SCRIPT><SCRIPT lang="JavaScript"><!--               
var tan = createTaniComponent(parseChar(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["left"])));               
connectCSS2(pl,tan,"left");               
--></SCRIPT></td>       
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_right)</script></td><td><SCRIPT lang="JavaScript"><!--
var pl = new QrSpinner(parseInt(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["right"])));               
pl.render();               
--></SCRIPT><SCRIPT lang="JavaScript"><!--               
var tan = createTaniComponent(parseChar(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["right"])));               
connectCSS2(pl,tan,"right");               
--></SCRIPT></td>       
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_bottom)</script></td><td><SCRIPT lang="JavaScript"><!--
var pl = new QrSpinner(parseInt(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["bottom"])));               
pl.render();               
--></SCRIPT><SCRIPT lang="JavaScript"><!--               
var tan = createTaniComponent(parseChar(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["bottom"])));               
connectCSS2(pl,tan,"bottom");               
--></SCRIPT></td>       
        </tr>
        <tr>
          <td class="QrCSSDesignerPadLeft"> </td><td></td>         
        </tr>
      </table>
    </td>   
  </tr>  
  <tr>  
    <td valign="top" colspan="3">  
      <table border="0" cellspacing="0" cellpadding="0">   
        <tr>                   
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">document.write EditorWindow.lang_css_backgroundimage</script></td>    
          <td>   
              <input size="28" name="bgimg" class="dialogInput" style="position: relative;z-index: 1;height:20;margin-bottom:0; left: 0px; top: 0px; width: 350px;">   
      		  <input id="sel_file" type="file" class="SysBTN5" size="0" style="margin-left:-22; z-index: 0;position: relative;top:2;left:0;height:20;">
      		  <script language="vbscript">document.write "<input type=""button"" value="""&EditorWindow.lang_css_backgroundimageremove&""" name=""BtnRemovebg"" class=""SysBtn5"" style=""height:20;width:150;font-size:8pt"">"</script>    
          </td>            
        </tr>
       </table>            
    </td>          
  </tr>         
  <tr>  
    <td valign="top">  
		<fieldset style="padding:3"><legend><script language="vbscript">Print_rule_text(EditorWindow.lang_css_view)</script></legend>             
			<div style="background-image: url('qrx/grid.gif'); width: 100%; height: 100; overflow: auto; margin: 5px; padding: 10px">         
				<div id="target">                 
					<script language="vbscript">document.write EditorWindow.lang_css_view_text</script>                  
				</div>             
			</div>             
             
			<TEXTAREA id="output" style="width: 100%; height: 121px; border: 1px solid gray; margin: 3px" cols="20">
			</TEXTAREA>             
        </fieldset>
    </td>        
    <td valign="top" style="padding-top:10">
    <table border="0" cellspacing="0" cellpadding="0">                  
      <tr>                  
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_textalign)</script></td><td><SCRIPT lang="JavaScript"><!--
               
var pl = new QrPulldown(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["text-align"]));               
pl.render();               
               
function addItem(item){               
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> "+item,item);               
}               
addItem("left");               
addItem("right");               
addItem("center");               
addItem("justify");               
connectCSS(pl,"text-align");               
               
--></SCRIPT></td>       
      </tr>
      <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_textdecoration)</script></td><td><SCRIPT lang="JavaScript"><!--
               
var pl = new QrPulldown(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["text-decoration"]));               
pl.render();               
               
function addItem(item){               
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> "+item,item);               
}               
addItem("none");               
addItem("underline");               
addItem("overline");               
addItem("underline overline");               
addItem("line-through");               
addItem("blink");               
connectCSS(pl,"text-decoration");               
               
--></SCRIPT></td>       
      </tr>
      <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_textindent)</script></td><td><SCRIPT lang="JavaScript"><!--
var pl = new QrSpinner(parseInt(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["text-indent"])));               
pl.render();               
--></SCRIPT><SCRIPT lang="JavaScript"><!--               
var tan = createTaniComponent(parseChar(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["text-indent"])));               
connectCSS2(pl,tan,"text-indent");               
--></SCRIPT></td>       
      </tr>
      <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_letterspacing)</script></td><td><SCRIPT lang="JavaScript"><!--
var pl = new QrSpinner(parseInt(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["letter-spacing"])));               
pl.render();               
--></SCRIPT><SCRIPT lang="JavaScript"><!--               
var tan = createTaniComponent(parseChar(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["letter-spacing"])));               
connectCSS2(pl,tan,"letter-spacing");               
--></SCRIPT></td>       
      </tr>
      <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_wordspacing)</script></td><td><SCRIPT lang="JavaScript"><!--
var pl = new QrSpinner(parseInt(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["word-spacing"])));               
pl.render();               
--></SCRIPT><SCRIPT lang="JavaScript"><!--               
var tan = createTaniComponent(parseChar(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["word-spacing"])));               
connectCSS2(pl,tan,"word-spacing");               
--></SCRIPT></td>       
      </tr>
      <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_texttransform)</script></td><td><SCRIPT lang="JavaScript"><!--                
               
var pl = new QrPulldown(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["text-transform"]));               
pl.render();               
               
function addItem(item){               
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> "+item,item);               
}               
addItem("none");               
addItem("capitalize");               
addItem("lowercase");               
addItem("uppercase");               
connectCSS(pl,"text-transform");               
               
--></SCRIPT></td>       
      </tr>
      <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_verticalalign)</script></td><td><SCRIPT lang="JavaScript"><!--                
               
var pl = new QrPulldown(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["vertical-align"]));               
pl.render();               
               
function addItem(item){               
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> "+item,item);               
}               
addItem("baseline");               
addItem("top");               
addItem("middle");               
addItem("bottom");               
addItem("text-top");               
addItem("text-bottom");               
addItem("super");               
addItem("sub");               
addItem("3em");               
addItem("30%");               
connectCSS(pl,"vertical-align");               
               
--></SCRIPT></td>       
      </tr>
      <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_wordbreak)</script></td><td><SCRIPT lang="JavaScript"><!--                
               
var pl = new QrPulldown(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["word-break"]));               
pl.render();               
               
function addItem(item){               
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> "+item,item);               
}               
addItem("normal");               
addItem("break-all");               
addItem("keep-all");      ;               
connectCSS(pl,"word-break");               
               
--></SCRIPT></td>      
      </tr>                   
    </table>
    　                   
    </td>       
    <td valign="top" style="padding-top:10">   
       <table border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_backgroundrepeat)</script></td><td><SCRIPT lang="JavaScript"><!--                 
                
var pl = new QrPulldown(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["background-repeat"]));                
pl.render();                
                
function addItem(item){                
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> "+item,item);                
}                
addItem("repeat");                
addItem("repeat-x");                
addItem("repeat-y");                
addItem("no-repeat");                
connectCSS(pl,"background-repeat");                
                
--></SCRIPT></td>        
        </tr> 
        <tr> 
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_backgroundposition)</script></td><td><SCRIPT lang="JavaScript"><!--                 
                
var pl = new QrPulldown(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["background-position"]));                
pl.render();                
                
function addItem(item){                
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> "+item,item);                
}                
addItem("left");                
addItem("right");                
addItem("top");                
addItem("left top");                
addItem("right bottom");                
addItem("30% 50%");                
connectCSS(pl,"background-position");                
                
--></SCRIPT></td>        
        </tr> 
        <tr> 
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_backgroundattachment)</script></td><td><SCRIPT lang="JavaScript"><!--                 
                
var pl = new QrPulldown(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["background-attachment"]));                
pl.render();                
                
function addItem(item){                
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> "+item,item);                
}                
addItem("fixed");                
addItem("scroll");                
connectCSS(pl,"background-attachment");                
                
--></SCRIPT></td>        
        </tr> 
        <tr> 
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_display)</script></td><td><SCRIPT lang="JavaScript"><!--                 
                
var pl = new QrPulldown(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["display"]));                
pl.render();                
                
function addItem(fontname){                
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> "+fontname,fontname);                
}                
addItem("");                
addItem("none");                
addItem("block");                
addItem("inline");                
addItem("run-in");                
addItem("compact");                
addItem("list-item");                
addItem("marker");                
connectCSS(pl,"display");                
                
--></SCRIPT></td>        
        </tr> 
        <tr> 
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_visibility)</script></td><td><SCRIPT lang="JavaScript"><!--                 
                
var pl = new QrPulldown(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["visibility"]));                
pl.render();                
                
function addItem(fontname){                
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> "+fontname,fontname);                
}                
addItem("");                
addItem("visible");                
addItem("hidden");                
connectCSS(pl,"visibility");                
                
--></SCRIPT></td>        
        </tr> 
        <tr> 
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_position)</script></td><td><SCRIPT lang="JavaScript"><!--                 
                
var pl = new QrPulldown(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["position"]));                
pl.render();                
                
function addItem(fontname){                
	pl.addItem("<img src='qrx/transparentpixel.gif' style='width:16px;height:16px;' align='middle'/> "+fontname,fontname);                
}                
addItem("static");                
addItem("relative");                
addItem("absolute");                
addItem("fixed");                
connectCSS(pl,"position");                
                
--></SCRIPT></td>        
        </tr> 
        <tr> 
          <td class="QrCSSDesignerPadLeft"><script language="vbscript">Print_rule_text(EditorWindow.lang_css_zindex)</script></td><td><SCRIPT lang="JavaScript"><!--                
var pl = new QrSpinner(getsrcObjectStyleBycssName(QrXPCOM.cssToJsMap["z-index"]));               
pl.render();               
connectCSS(pl,"z-index");               
--></SCRIPT></td>       
        </tr>
      </table>
    </td>          
  </tr>         
  <tr>  
    <td valign="top" colspan="3" style="text-align:right;padding-right:20">     
    	<script language="vbscript">
    		document.write "<input type=""button"" value="""&EditorWindow.lang_button_ok&""" name=""BtnOk"" class=""SysBtn5"">"
			document.write "<input type=""button"" value="""&EditorWindow.lang_button_cancel&""" name=""BtnCancel"" class=""SysBtn5"">"
			document.write "<input type=""button"" value="""&EditorWindow.lang_button_apply&""" name=""BtnUse"" class=""SysBtn5"">"
		</script>       
	</td>          
  </tr>         
</table>         
<br>
</body>               
</HTML>